import { createRouter, createWebHistory } from 'vue-router'
import Layout from '../views/Layout.vue'
import Home from '../views/Home.vue'
import Login from '../views/Login.vue'
import CreateCharacter from '../views/CreateCharacter.vue'
import MyCharacters from '../views/MyCharacters.vue'
import MyFollows from '../views/MyFollows.vue'
import Chat from '../views/Chat.vue'
import Register from '../views/Register.vue'
import Profile from '../views/Profile.vue'

 const routes = [
  {
    path: '/',
    redirect: '/login'
  },
  {
    path: '/login',
    name: 'Login',
    component: Login
  },
  {
    path: '/register',
    name: 'Register',
    component: Register
  },
  {
    path: '/app',
    component: Layout,
    redirect: '/app/character-square',
    children: [
      {
        path: 'character-square',
        name: 'CharacterSquare',
        component: Home
      },
      {
        path: 'my-characters',
        name: 'MyCharacters',
        component: MyCharacters
      },
      {
        path: 'my-follows',
        name: 'MyFollows',
        component: MyFollows
      },
      {
        path: 'create-character',
        name: 'CreateCharacter',
        component: CreateCharacter
      },
      {
        path: 'profile',
        name: 'Profile',
        component: Profile
      },
      {
        path: 'chat/:id',
        name: 'Chat',
        component: Chat
      }
    ]
  }
]

const router = createRouter({
  history: createWebHistory(),
  routes
})

export default router